<template>
  <div class="contact">
    <h1>全国工业APP和信息消费大赛</h1>
    <p><span>地址：</span>{{ contactData.address }}</p>
    <p><span>邮编：</span>{{ contactData.zip_code }}</p>
    <p><span>电话：</span>{{ contactData.phone }}</p>
    <p><span>邮箱：</span>{{ contactData.email }}</p>
    <p><span>QQ：</span>{{ contactData.qq }}</p>
    <p><span>官方QQ群：</span>{{ contactData.qq_group }}</p>
    <img :src="contactData.wx_code" alt="" srcset="" />
  </div>
</template>
<script>
import { mapGetters, mapActions} from "vuex";
export default {
  name: "contact",
  components: {
  },
  data() {
    return {
      
    };
  },
  mounted() {
    this.getContactData()
  },
  methods: {
    ...mapActions(["getContactData"]),
  },
  computed: {
    ...mapGetters(["contactData"]),
  },
};
</script>
<style scoped>
.contact {
  margin: 0 auto;
  padding: 23px 53px 0 23px;
  min-height: 50vh;
}
.contact h1 {
  font-size: 15px;
  color: #666666;
  font-weight: bold;
  font-family: Source Han Sans CN;
  font-weight: 500;
  margin-bottom: 5px;
}
.contact p {
  font-size: 12px;
  line-height: 24px;
  color: #666;
}
.contact span {
  color: #666;
  font-weight: bold;
}
.contact p:nth-of-type(5) {
  margin-top: 20px;
}
</style>